import Vue from 'vue'
import VueRouter from 'vue-router'
import store from '@/store'
import navData from "@/utils/navData";

// 网页加载进度条
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'

// 路由
Vue.use(VueRouter)
// 防止路由重复点击报错
let routerPush = VueRouter.prototype.push;
VueRouter.prototype.push = function push(location) {
  return routerPush.call(this, location).catch(err => err);
};

// 公共路由，不需要访问权限的路由
let routes = [
  {
    path: '/',
    component: () => import(/* webpackChunkName: "App模板 - 后台" */ '../views'),
    redirect: 'home',
    children: [
      {
        path: 'home',
        name: 'home',
        meta: {
          title: '首页',
          icon: 'sg sg-dashboard',
        },
        component: () => import(/* webpackChunkName: "后台模板" */"../views/rightMain/Home.vue"),
        // component: () => import(/* webpackChunkName: "后台模板" */ '../views/routesPage'),
      },
    ]
  },
  {
    path: '/login',
    name: 'login',
    meta: {
      title: '登录',
    },
    component: () => import(/* webpackChunkName: "登录" */ '../views/login/index.vue'),
  },
  {
    path: '/404',
    name: '404',
    meta: {
      title: '404'
    },
    component: () => import(/* webpackChunkName: "404" */ '../views/404'),
  },
  {
    path: '*',
    redirect: '/404',
  }
]

routes.push({
  path: '/front',
  name: 'Front',
  component: () => import('@/views/front/Front.vue'),
  children: [
    { path: 'home', name: 'FHome', meta: { name: '系统首页' }, component: () => import('@/views/front/Home') },
    { path: 'activity', name: 'FActivity', component: () => import('@/views/front/Activity') },
    { path: 'feedback', name: 'FFeedback', component: () => import('../views/front/Feedback') },
    { path: 'info', name: 'FInfo', component: () => import('../views/front/Info') },
    { path: 'activityDetail', name: 'FActivityDetail', component: () => import('../views/front/ActivityDetail') },
    { path: 'infoDetail', name: 'FInfoDetail', component: () => import('../views/front/InfoDetail') },
    { path: 'activityReg', name: 'FActivityReg', component: () => import('../views/front/ActivityReg') },
    { path: 'person', name: 'FPerson', meta: { name: '个人信息' }, component: () => import('../views/front/Person') },
    { path: 'volunteer', name: 'FVolunteer', meta: { name: '优秀志愿者' }, component: () => import('../views/front/Volunteer') },
  ]
}
)

// 需要访问权限的路由，前端自由化，后端只需要对name值进行权限标识(如{"path": "/baidumap1","roles": "admin"})，前端再通过传回的roles进行定向验证
let navRoutes = []

navData.forEach(items => {
  if (items.children.length > 0) {
    items.children.forEach(item => {
      navRoutes.push(
        {
          path: item.path,
          name: item.name,
          meta: {
            title: item.title,
            icon: 'sg sg-dashboard',
           },
          component: item.component
        }
      )
    })
  } else {
    navRoutes.push(
      {
        path: items.path,
        name: items.name,
        meta: {
          title: items.title,
          icon: 'sg sg-dashboard',
         },
        component: items.component
      }
    )
  }
})

// 将权限路由添加到公共路由里某一个地方
routes.push.apply(routes[0].children, navRoutes);

//将权限路由添加到vuex里
store.state.rolesRoutes = JSON.parse(JSON.stringify(navRoutes));

const router = new VueRouter({
  mode: 'history',
  routes
})

// import { MessageBox } from 'element-ui'
// 导航守卫 · 前
router.beforeEach((to, from, next) => {

  NProgress.start();// 开启网页加载进度条

  /*router.beforeEach((to, from, next) => {
    console.log(to.meta.title);
    const token = localStorage.getItem('edb-authorization-token')
    console.log(token);

    // 判断是否有token 还需判断token是否与登录时一致
    if (token !== null) {
      if (to.path === '/login') {
        next('/')
      } else {
        next()
      }
    } else { // 无toke时
      if (to.path === '/login') {
        next()
      } else {
        next('/login');
      }
    }
  }) */

  // 设置网站标题
  document.title = to.meta.title + ' - ' + store.state.siteInfo.title;// 本地获取路由标题

  next();
});

// 导航守卫 · 后
router.afterEach((to, from) => {
  NProgress.done();// 结束网页加载进度条
})

export default router
